<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>反三科用户订单列表</title>
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css"/>
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="http://cdn.staticfile.org/artTemplate.js/3.0.1/template.js"></script>
    <!--分页插件-->
    <script src="./bootstrap-paginator.js"></script>
</head>
<body>
  <h2>反三科用户订单列表</h2>
  <div>
      <div class="col-sm-9" style="margin-left: 50px; margin-bottom: 40px;margin-top: 20px;">
          <div class="col-sm-2">
              <select class="form-control" id="statusSelect">
                  <option value="">全部</option>
                  <option value="1">已支付</option>
                  <option value="0">未支付</option>
              </select>
          </div>
          <div class="col-sm-3">
              <input type="text" class="form-control" id="orderId" placeholder="请输入订单编号"/>
          </div>
          <div class="col-sm-1">
              <button type="button" class="btn btn-primary" onclick="getDate(1)">查询</button>
          </div>

      </div>
      <table class="table table-striped" style="margin-left: 10px; margin-right: 10px;">
          <thead>
          <tr>
              <th>订单编号</th>
              <th>类型</th>
              <th>姓名</th>
              <th>手机号</th>
              <th>科目</th>
              <th>订单价格</th>
              <th>下单时间</th>
              <th>订单状态</th>
              <th>申请退款时间</th>
              <th>退款处理状态</th>
              <th>操作</th>
          </tr>
          </thead>
          <tbody id="content">
          </tbody>
      </table>
   </div>
  <div class="page">
      <ul class="pagination" style="margin-left: 15%"></ul>
  </div>

  <script id="trHtml" type="text/html">
          {{each list as value i}}
          <tr>
              <td>{{value.orderId}}</td>
              <td>{{value.groupTypeStr}}</td>
              <td>{{value.name}}</td>
              <td>{{value.phone}}</td>
              <td>{{value.goodsName}}</td>
              <td>{{value.amount/100}}</td>
              <td>{{value.createTime}}</td>
              <td>{{value.payStatusStr}}</td>
              <td>{{value.refundStatusStr}}</td>
              <td>{{value.refundTime}}</td>
              <td>
                  {{if value.payStatus == 1}}
                        {{if value.refundStatus == -1}}
                            <button type="button" class="btn btn-warning btn-sm" onclick="refund('{{value.orderId}}')">退款</button>
                        {{/if}}
                  {{/if}}
              </td>
          </tr>
          {{/each}}
  </script>

  <script type="text/javascript">
      var indexPage = 1;

      $(document).ready(function(){
          getDate(1);
      });

      function getDate(index){
          var status = $("#statusSelect").val();
          var order = $('#orderId').val();
          $.ajax({
              type: 'GET',
              url: '/activity-gateway/group-api/groupSPAdWeb/order/getAllUserOrders',
              data: {'projectCode' : 'GroupBuy01SP', 'pageSize' : 10 , 'pageIndex' : index , 'payStatus':status , 'orderId':order},
              success:function(data){
                         console.log(data);
                          var html = template('trHtml', data.data);
                          $('#content').html(html);
                          setPage(index, data.data.totalPage, getDate)
                      },
              dataType: 'json'

          });
      }

      function setPage(pageCurrent, pageSum, callback) {
          $(".pagination").bootstrapPaginator({
              //设置版本号
              bootstrapMajorVersion: 3,
              // 显示第几页
              currentPage: pageCurrent,
              // 总页数
              totalPages: pageSum,
              //当单击操作按钮的时候, 执行该函数, 调用ajax渲染页面
              onPageClicked: function (event,originalEvent,type,page) {
                  indexPage = page;
                  callback(page);
              }
          })
      }

      function refund(id) {
          if(confirm("确定要退款么?")){
              //点击确定后操作
              $.ajax({
                  type: 'GET',
                  url: '/activity-gateway/group-api/groupSPAdWeb/order/refundByOrderId',
                  data: {'projectCode' : 'GroupBuy01SP',  'orderId':id},
                  success:function(data){
                      if(data.success){
                          alert("退款成功！");
                          getDate(indexPage);
                      }else{
                          alert("退款失败，请联系管理员。--" + data.desc);
                      }
                  },
                  error : function(){
                    alert("退款失败，请联系管理员。--");
                  },
                  dataType: 'json'

              });
          }
      }
  </script>
</body>
</html>